<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <link rel="stylesheet" href="./mui/css/mui.min.css">
    <style>
        * {
            touch-action: pan-y;
        }

        html,
        body {
            background-color: #efeff4;
        }

        .mui-bar .mui-pull-left .mui-icon {
            padding-right: 5px;
            font-size: 28px;
        }

        .mui-bar .mui-btn {
            font-weight: normal;
            font-size: 17px;
        }

        .mui-bar .mui-btn-link {
            top: 1px;
        }

        .mui-table-view li {
            color: blueviolet
        }

        .searchbox {
            width: 100%;
            height: 30px;
            border: 1px solid gray;
            border-radius: 5px;
        }

        .searchbox span {
            font-size: 14px;



        }


        .mui-card .mui-control-content {
            padding: 10px;
        }

        .mui-control-content {
            height: 500px;
        }
    </style>
</head>

<body>
    <header id="header" class="mui-bar mui-bar-nav">
        <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
        <h1 class="mui-title">公司会议</h1>
        <a class="mui-icon mui-icon-bars mui-pull-right"></a>

    </header>
    <!-- .................................................................................................... -->

    <div class="mui-content">
        <div class="searchbox">
            <span class="mui-icon mui-icon-search  ">搜索</span>
        </div>

        <!-- .................................................................................................................. -->
        <div style="padding: 10px 10px;">
            <div id="segmentedControl" class="mui-segmented-control">
                <a class="mui-control-item mui-active" href="#item1">总公司会议（8）</a>
                <a class="mui-control-item" href="#item2">分公司会议(3)</a>

            </div>
        </div>
        <div>
            <div id="item1" class="mui-control-content mui-active">
                <div id="scroll" class="mui-scroll-wrapper">
                    <div class="mui-scroll">
                        <ul class="mui-table-view">
                            <li class="mui-table-view-cell">
                                <a href="./meetingdetail.html"> 会议-1</a>
                            </li>
                            <li class="mui-table-view-cell">
                                <a href="./meetingdetail.html"> 会议-2</a>
                            </li>
                            <li class="mui-table-view-cell">
                                <a href="./meetingdetail.html"> 会议-3</a>
                            </li>
                            <li class="mui-table-view-cell">
                                <a href="./meetingdetail.html"> 会议-4</a>
                            </li>
                            <li class="mui-table-view-cell">
                                <a href="./meetingdetail.html"> 会议-5</a>
                            </li>


                        </ul>
                    </div>
                </div>
            </div>
            <div id="item2" class="mui-control-content">
                <ul class="mui-table-view">
                    <li class="mui-table-view-cell">
                        会议-1
                    </li>
                    <li class="mui-table-view-cell">
                        会议-2
                    </li>
                    <li class="mui-table-view-cell">
                        会议-3
                    </li>
                    <li class="mui-table-view-cell">
                        会议-3
                    </li>
                    <li class="mui-table-view-cell">
                        会议-3
                    </li>
                </ul>
            </div>

        </div>


    </div>




    </div>

    <!-- ..................................................................................... -->





</body>
<script src="./mui/js/mui.min.js"></script>

<script src="./jquery/jquery-1.12.2.js"></script>
<script>

    mui.init({
        swipeBack: true //启用右滑关闭功能
    });
    (function ($) {
        $('#scroll').scroll({
            indicators: true //是否显示滚动条
        });
        var segmentedControl = document.getElementById('segmentedControl');

    })(mui);



    $(function () {
        getData();
        function getData() {
            var temp = '';
            $.ajax({
                type: 'get',
                url: '/meet.json',
                dataType: 'json',
                success: function (res) {
                    var list = res.animals;
                    console.log(list);

                }
            })
        }
    })

</script>

</html>